<template>
  <view :style="themeColor()">
    <view v-if="agreement && agreement.content" class="py-[var(--top-m)] px-[var(--sidebar-m)]">
      <view class="text-[32rpx] font-500 mb-[16rpx] multi-hidden leading-[1.4]">
        {{ agreement.title }}
      </view>
      <view class="text-[24rpx] text-[var(--text-color-light9)]">
        {{ timeFormat(agreement.createTime, 'yyyy-mm-dd hh: MM: ss') }}
      </view>
      <u-parse :content="agreement.content" :tagStyle="{ img: 'vertical-align: top;' }"></u-parse>
    </view>

    <view v-else-if="!loading" class="min-h-[100vh] bg-[var(--page-bg-color)] overflow-hidden">
      <view class="empty-page">
        <image class="img" :src="img('static/resource/images/empty.png')" model="aspectFit" />
        <view class="desc">暂无内容</view>
      </view>
    </view>
  </view>
</template>
<script lang="ts" setup>
import { ref } from 'vue'
import { onLoad } from '@dcloudio/uni-app'
import { getArticle } from './../api/index'
import { img, goback } from '@/utils/common'
import { timeFormat } from '@/utils/formatting'

const agreement = ref(null)
const loading = ref(true)
onLoad((option: any) => {
  console.log(option)
  if (option) {
    getArticle(option).then((res: any) => {
      agreement.value = res.data
      loading.value = false
      uni.setNavigationBarTitle({
        title: res.data.title
      })
    }).catch(() => {
      loading.value = false
    })
  } else {
    let parameter = {
      url: '/app/pages/index/index',
      title: '文章不存在',
      mode: 'reLaunch'
    };
    goback(parameter)
  }
})
</script>

<style lang="scss"></style>
